<!DOCTYPE html>
<html lang="en">

<head>
	<meta charset="UTF-8" />
	<meta name="keywords" content="" />
	<meta name="description" content="" />
	<title>E-Bank Service 商户管理平台</title>
	<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1, user-scalable=0" name="viewport">
	<meta content="yes" name="apple-mobile-web-app-capable">
	<meta content="black" name="apple-mobile-web-app-status-bar-style">
	<meta content="telephone=no" name="format-detection">
	<link rel="stylesheet" href="layui/css/layui.css" />
	<link rel="stylesheet" href="css/admin.css" />
	<link rel="stylesheet" type="text/css" media="screen and (max-width:992px)" href="css/admin.mobile.css">
</head>

<body>
	<!-- 布局容器 -->
	<div class="layui-layout layui-layout-admin">

		<!-- 头部 -->
		<div id="header">
			<header-component></header-component>
		</div>

		<!-- 遮罩层 -->
		<div class="masked"></div>

		<!-- 左侧菜单 -->
		<div id="leftSlide">
			<leftslide-component></leftslide-component>
		</div>

		<!-- 主体 -->
		<div class="layui-body">
			<!-- 主要内容 -->
			<div class="container">
                <!-- 搜索条件 -->
                <div class="search-res-mask"></div>
                <div class="search-res">
                    <div class="search-res-btn hide-pc">
                        <button class="layui-btn" id="search-btn"><i class="layui-icon">&#xe615;</i>查询</button>
                    </div>
                    <div class="content-search search-fix">
                        <div class="layui-form layui-form-pane">
                            <div class="layui-inline">
                                <label class="layui-form-label">商品名称</label>
                                <div class="layui-input-inline">
                                    <input class="layui-input" placeholder="请输入商品名称">
                                </div>
                            </div>
                            <div class="layui-inline">
                                <label class="layui-form-label">商品状态</label>
                                <div class="layui-input-inline">
                                    <select lay-verify="" id="select-year">
                                        <option value="">请选择商品状态</option>
                                        <option value="1">待上架</option>
                                        <option value="2">已上架</option>
                                        <option value="3">已下架</option>
                                    </select>
                                </div>
                            </div>
                            <div class="layui-inline">
                                <label class="layui-form-label">时间段</label>
                                <div class="layui-input-inline">
                                    <input class="layui-input layui-date" skin="molv" placeholder="请选择时间段" id="time" readonly>
                                </div>
                            </div>
                            <div class="layui-inline">
                                <button class="layui-btn" lay-submit="">查询</button>
                                <button class="layui-btn layui-btn-primary hide-pc" id="search-close">关闭</button>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="tar mt10">
                    <a class="layui-btn layui-btn-normal layui-btn-small" href="发布商品.html">+发布商品</a>
                    <button class="layui-btn layui-btn-normal layui-btn-small">导出</button>
                </div>
                <!-- 表格列表 -->
                <div class="table-list">
                    <table class="layui-table layui-list-table" lay-skin="line">
                        <thead>
                            <tr>
                                <th>商品名称</th>
                                <th>所属品牌</th>
                                <th>销售价</th>
                                <th>商品库存</th>
                                <th>已售数量</th>
                                <th>商品状态</th>
                                <th>发布时间</th>
                                <th>操作</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr>
                                <td class="layui-table-first"><i class="layui-table-hd">商品名称</i><span class="layui-table-bd"><img class="img-cp fl mr10" src="img/1.jpg" alt="">Apple iPhoneX 128G 红色特别版红色特别版红色特别版<p class="gray">128G,红色</p></span></td>
                                <td><i class="layui-table-hd">所属品牌</i><span class="layui-table-bd">Apple</span></td>
                                <td><i class="layui-table-hd">销售价</i><span class="layui-table-bd price">1000.00</span></td>
                                <td><i class="layui-table-hd">商品库存</i><span class="layui-table-bd">783</span></td>
                                <td><i class="layui-table-hd">已售数量</i><span class="layui-table-bd">888</span></td>
                                <td><i class="layui-table-hd">商品状态</i><span class="layui-table-bd">已发布</span></td>
                                <td><i class="layui-table-hd">发布时间</i><span class="layui-table-bd">2017-09-19</span></td>
                                <td class="layui-table-btn">
                                    <button class="layui-btn layui-btn-normal layui-btn-small a2">下架</button>
                                    <button onclick="window.location.href='商品详情.html'" class="layui-btn layui-btn-normal layui-btn-small">查看详情</button>
                                </td>
                            </tr>
                            <tr>
                                <td class="layui-table-first"><i class="layui-table-hd">商品名称</i><span class="layui-table-bd"><img class="img-cp fl mr10" src="img/1.jpg" alt="">Apple iPhoneX 128G 红色特别版红色特别版红色特别版<p class="gray">128G,红色</p></span></td>
                                <td><i class="layui-table-hd">所属品牌</i><span class="layui-table-bd">Apple</span></td>
                                <td><i class="layui-table-hd">销售价</i><span class="layui-table-bd price">1000.00</span></td>
                                <td><i class="layui-table-hd">商品库存</i><span class="layui-table-bd">783</span></td>
                                <td><i class="layui-table-hd">已售数量</i><span class="layui-table-bd">888</span></td>
                                <td><i class="layui-table-hd">商品状态</i><span class="layui-table-bd">已发布</span></td>
                                <td><i class="layui-table-hd">发布时间</i><span class="layui-table-bd">2017-09-19</span></td>
                                <td class="layui-table-btn">
                                    <button class="layui-btn layui-btn-warm layui-btn-small add">待上架</button>
                                    <button class="layui-btn layui-btn-danger layui-btn-small a4">删除</button>
                                    <button class="layui-btn layui-btn-normal layui-btn-small a2">查看详情</button>
                                </td>
                            </tr>
                            <tr>
                                <td class="layui-table-first"><i class="layui-table-hd">商品名称</i><span class="layui-table-bd"><img class="img-cp fl mr10" src="img/1.jpg" alt="">Apple iPhoneX 128G 红色特别版红色特别版红色特别版<p class="gray">128G,红色</p></span></td>
                                <td><i class="layui-table-hd">所属品牌</i><span class="layui-table-bd">Apple</span></td>
                                <td><i class="layui-table-hd">销售价</i><span class="layui-table-bd price">1000.00</span></td>
                                <td><i class="layui-table-hd">商品库存</i><span class="layui-table-bd">783</span></td>
                                <td><i class="layui-table-hd">已售数量</i><span class="layui-table-bd">888</span></td>
                                <td><i class="layui-table-hd">商品状态</i><span class="layui-table-bd">已下架</span></td>
                                <td><i class="layui-table-hd">发布时间</i><span class="layui-table-bd">2017-09-19</span></td>
                                <td class="layui-table-btn">
                                    <button class="layui-btn layui-btn-danger layui-btn-small a4">删除</button>
                                </td>
                            </tr>
                        </tbody>
                    </table>
                </div>
                
                <!-- 分页 -->
                <div id="table-pages" class="tac"></div>
				
			</div>
		</div>
	</div>
	<!-- 可不引入 -->
	<script type="text/javascript" src="js/vue.min.js"></script>
	<script type="text/javascript" src="layui/layui.js"></script>
	<script type="text/javascript" src="js/fastclick.js"></script>
	<script type="text/javascript" src="js/admin.js"></script>
	<script>
		layui.use(['jquery', 'form', 'laydate', 'layer', 'laypage', 'element'], function () {
			var $ = layui.jquery,
				laydate = layui.laydate,
				layer = layui.layer,
				laypage = layui.laypage,
				element = layui.element;
			$(function () {
				FastClick.attach(document.body);
			});

			// 分页
			laypage.render({
				elem: 'table-pages'
				, count: 5
				, layout: ['prev', 'page', 'next', 'count', 'skip']
				, jump: function (obj, first) {
					//obj包含了当前分页的所有参数，比如：
					console.log(obj.curr); //得到当前页，以便向服务端请求对应页的数据。
					console.log(obj.limit); //得到每页显示的条数

					//首次不执行
					if (!first) {
						//do something
					}
				}
			});


			// 开始时间及截止时间
			laydate.render({
				elem: '#time'
				, range: true
				, type: 'date'  // 'month'  'date' 'datetime'
				, done: function (value, date, endDate) {
					console.log(value); //得到日期生成的值，如：2017-08-18
					console.log(date); //得到日期时间对象：{year: 2017, month: 8, date: 18, hours: 0, minutes: 0, seconds: 0}
					console.log(endDate); //得结束的日期时间对象，开启范围选择（range: true）才会返回。对象成员同上。
				}
				,trigger: 'click'
			});

			// 提现操作
			$(document).on("click", ".a1", function () {
				window.location.href = "提现操作.html"
			});

			// 提现详情
			$(document).on("click", ".a2", function () {
				window.location.href = "提现详情.html"
			});

			// 添加提现账户
			$(document).on("click", ".add", function () {
				window.location.href = "添加提现账户.html"
			});

			// 删除操作
			$(document).on("click", ".a4", function () {
				layer.confirm('您确认要删除该提现账户吗？', { title: '删除操作' }, function (index) {
					layer.close(index);
					layer.msg('删除成功！', { time: 1000 });
				});
			});

			

		});
	</script>
</body>

</html>